<!DOCTYPE html>
<html lang="en">
  <head>
	<meta charset="utf-8"/>
	<title>8-Bit Music</title>
	
	<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/reset/reset-min.css" />
	<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/fonts/fonts-min.css" />
	<link rel="stylesheet" type="text/css" href="http://x.myspacecdn.com/modules/activity/static/css/activities_tyq3zov4.css" />
	<link rel="stylesheet" type="text/css" href="/stylesheets/main.css" />

	<script type="text/javascript" src="/javascripts/myspaceid.rev.0.js" ></script>
	<!--[if IE]><script type="text/javascript" src="http://remysharp.com/downloads/html5.js"></script><![endif]-->
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" ></script>

  </head>
  <body>

	<div id="login" class='rounded-corner-bottom'>
	  <div class='logout'>
		<span class='<%= @is_logged_in ? 'logout_isSignedin' : 'logout_isSignedout' %>' >
		<%= link_to("[x] signout", {:action => :logout}, :title => "signout") %>
	  </span>
	</div>
	
	<div class='login'>
	  <span class="<%= @is_logged_in ? 'login_isSignedin' : 'login_isSignedout' %>">
	  <b>please login:</b><br/><br/>
	  <a href="#login" 
		 class="msid__login"
		 onclick="p2()">
		<img src="/images/myspaceid.png" alt="Login with MySpaceID" />
	  </a>
	</span>
  </div>
</div>

<div id="branding" class='rounded-corner-bottom'>8-Bit Music</div>

<ul id="nav">
  <li><a href="/">HOME</a></li>
  <li><a href="#">MAP</a></li>
  <li><a href="#">SONGS</a></li>
  <li><a href="#">PROFILE</a></li>
  <li><a href="#">FEATURED</a></li>
</ul>

<div id="content_loggedOut" class="<%= @is_logged_in ? 'welcome_LoggedIn' : 'welcome_LoggedOut' %>">
<div style="background-color: #CCCCCC; padding: 3px;">
  <div style="background-color: #FFFFFF; text-align: center; padding: 25px;">
	Welcome to 8-Bit Music: a community to share and discover video game tunes. Please login!<br><br>
	<img src="/images/profile_pic.png" />
  </div>
</div>	
</div>

<div id="content" class="<%= @is_logged_in ? 'content_loggedIn' : 'content_loggedOut' %>">
<ul id="cols">

  <li id="profile" class='rounded-corner-left'>
	<% if @is_logged_in %>

	<div id="profile-view">
	  <img id="profile-pic" src="<%= profile_pic %>" alt="<%= display_name %>"/>
	  <div id="caption">
		<div id="caption-left">
		  <a href="<%= profile_more_pics %>" style="margin-right: 3px;">pics</a>/
		  <a href="<%= profile_more_vids %>" style="margin-left: 3px;">video</a>/
		  <a href="<%= profile_more_play %>" style="margin-left: 3px;">music</a>
		</div>
		<div id="caption-right">
		  <img src="/images/profile_icon.png" alt="yay blue" />
		  <img src="/images/level_icon.png" alt="uber" />
		</div>
	  </div>
	</div>

	<h1><span class="display-name"><%= display_name %></span></h1>
	<h2><%= profile_age %>, <%= profile_city %></h2>

	<h3>LAST LOGIN:</h3>
	<p id="member-date"><%= profile_last_update %></p>

	<h3>HEADLINE:</h3>
	<p id="headline"><%= profile_headline %></p>

	<p id="about-me">
	  <%= profile_about_me %>
	</p>

	<p id="desiretomeet">
	  <%= profile_to_meet %>
	</p>
  </li>
  <li id="basic-info">
	<h1><span class="display-name"><%= profile_name %></span>'s Basic Info</h1>

  <h2>General:</h2>
  <p id="General"><%= profile_interests %></p>

  <h2>Music:</h2>
  <p id="music"><%= profile_music %></p>

  <h2>Movies:</h2>
  <p id="movies"><%= profile_movies %></p>

  <h2>Television:</h2>
  <p id="television"><%= profile_television %></p>

  <h2>Books:</h2>
  <p id="books"><%= profile_books %></p>

  <h2>Heroes:</h2>
  <p id="heroes"><%= profile_heroes %></p>
  </li>

  <li id="activities" class='rounded-corner-right'>

	<% if @is_logged_in && @activities_data && @friends_activities_data %>
	<h1><span class='display-name'>Friend's or Band's Activities</span></h1>
	<ul class="activitiesContainer" >
	  <% each_song(@friends_activities_data) do |song_entry| %>
	    <li class='activityItem <%= song_entry.elements['category'].attribute('label') %>' >
		<% song_entry.elements['content'].elements['div'].elements.each do |child| %>
		  <%= child.to_s %>
		<% end %>
	    </li>
	  <% end %>
    </ul>
	<% end %>

  </li>
<% end %>
</ul>
</div>

<script>
  function p2(){
    msOptions.realm = "<%= compute_realm  %>"
    msOptions.returnTo = "<%= url_for :action => 'complete', :only_path => false  %>"
	msOptions.consumer = "<%= UserController::CONSUMER_KEY %>"
  var ms = new MySpaceID(msOptions);
  }

  function success(rand) {
  //alert(rand);
  window.location.href="<%= url_for :action => 'index', :only_path => false  %>";
  }

  function failed(rand) {
  $('#login div.logout span').addClass("logout_isSignedout");
  $('#login div.logout span').removeClass("logout_isSignedin");
  }
</script>
<div id="copyright">&copy; 2008-2009. 8-Bit Music. All Rights Reserved.<br>This site supports OpenID authentication. <a href="http://www.openid.net" target="_blank">Learn More</a></div>
</body>
</html>
